<template>
    <header>
        <van-nav-bar title="主题设置" style="background-color: #F4F4F4; margin-top: 0px;" />
    </header>
    <col-row style="margin-top: 30px;">
        <van-config-provider :theme="them" style="font-size: 20px;">
            <van-cell-group style="margin-top: 30px;">
                <van-cell center title="深色模式" style="font-size: 15px;">
                    <template #right-icon>
                        <van-switch v-model="checked" size="22px"/>
                    </template>
                </van-cell>
            </van-cell-group>
        </van-config-provider>

    </col-row>
</template>
<script setup>
import { ref } from 'vue'
// 开关
const checked = ref(true);
// 主题
const theme = ref('light');
setTimeout(() => {
    theme.value = 'dark';
}, 10);
</script>
<style scoped>
.van-theme-dark body {
    color: #f5f5f5;
    background-color: black;
}
</style>